<script lang="ts" setup name="CommonTypes">
import { CirclePlus, Delete, EditPen } from '@element-plus/icons-vue'
import { ProTableInstance } from '~/library/components/ProTable/interface'
import { Procure } from '~/src/api/interface/procure'
import { createBreakageResultAPI, deleteBreakageResultAPI, editBreakageResultAPI, getBreakageResultAPI } from '~/src/api/procure'
import { getDicData } from '~/src/api/systemLog'
import CommonTypesDialog from './components/CommonTypesDialog.vue'
import { commonTypesColumns } from './info/columns'
// 明天任务定义类型接口

const proTableRef = ref<ProTableInstance>()
const initData = reactive<Procure.BreakageResult>({
  commTypeId: 1,
  customeCode: '',
  id: 0,
  name: '',
  status: 1,
})
const dialogRef = ref<InstanceType<typeof CommonTypesDialog>>()
const openDialog = async (title: string, row: Procure.BreakageResult) => {
  const { data } = await getDicData('CommonType')
  row.commTypeId = data[0].value as number
  const params = {
    title,
    data: { ...row },
    api: title === '新增' ? createBreakageResultAPI : title === '编辑' ? editBreakageResultAPI : undefined,
    list: data,
    getTableList: proTableRef.value?.getTableList,
  }
  dialogRef.value?.acceptParams(params)
}

const deleteCategory = () => {
  useDeleteData(deleteBreakageResultAPI, proTableRef.value as ProTableInstance)
}
</script>

<template>
  <div class="auto-height-container">
    <pro-table
      ref="proTableRef"
      :columns="commonTypesColumns"
      :indent="20"
      :isCard="false"
      :request-api="getBreakageResultAPI"
      row-key="id"
      title="通用类型管理列表"
    >
      <template #tableHeader>
        <el-button v-auth="'add'" :icon="CirclePlus" type="primary" @click="openDialog('新增', initData)">新增</el-button>
        <el-button v-auth="'delete'" :icon="Delete" @click="deleteCategory">删除</el-button>
      </template>
      <template #customeCode="{ row }">
        <el-button v-auth="'edit'" :icon="EditPen" link type="primary" @click.stop="openDialog('编辑', row)">
          {{ row.customeCode }}
        </el-button>
      </template>
    </pro-table>
    <common-types-dialog ref="dialogRef" />
  </div>
</template>

<style lang="scss" scoped></style>
